<template>
	<view class="container">
	
		

		<uni-section title="您的专属优惠券!" type="line">
			<uni-card :cover="cover" @click="onClick">
				<image  style="width: 100%;"  src="../../static/quan.jpg"></image>

				<view slot="actions" class="card-actions">
					<view class="card-actions-item"  @click="goto('/pages/volunteer/volunteer')">
						<uni-icons  size="18" color="#999"></uni-icons>
						<text class="card-actions-item-text">查看</text>
					</view>
					<view class="card-actions-item" @click="goto('/pages/shopping/shopping')">
						<uni-icons  size="18" color="#999"></uni-icons>
						<text class="card-actions-item-text">使用</text>
					</view>
					<view class="card-actions-item" @click="goto('/pages/panicBuying/panicBuying')">
						<uni-icons size="18" color="#999"></uni-icons>
						<text class="card-actions-item-text">购买</text>
					</view>
				</view>
			</uni-card>
		</uni-section>

	

	


	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
			cover: '',
				avatar: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png',
				extraIcon:{
					color: '#4cd964',
					size: '22',
					type: 'gear-filled'
				}
			}
		},
		methods: {
			goto(url) {
				if (!this.user) {
					uni.navigateTo({
						url: url
					})
				} else {
					uni.navigateTo({
						url: url
					})
				}
			
			},
			onClick(e){
				console.log(e)
			},
			actionsClick(text){
				uni.showToast({
					title:text,
					icon:'none'
				})
			}
		}
	}
</script>

<style lang="scss">

	.container {
		overflow: hidden;
	}

	.custom-cover {
		flex: 1;
		flex-direction: row;
		position: relative;
	}

	.cover-content {
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		height: 40px;
		background-color: rgba($color: #000000, $alpha: 0.4);
		display: flex;
		flex-direction: row;
		align-items: center;
		padding-left: 15px;
		font-size: 14px;
		color: #fff;
	}

	.card-actions {
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		align-items: center;
		height: 45px;
		border-top: 1px #eee solid;
	}
	.card-actions-item {
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.card-actions-item-text {
		font-size: 12px;
		color: #666;
		margin-left: 5px;
	}
	.cover-image {
		flex: 1;
		height: 150px;
	}
	.no-border {
		border-width: 0;
	}
</style>
